<template>
  <div class="mygoods">
      <scroller style="top：44px;">
        <div class="goodslist">  
          <goods-item v-for="(item,index) in goodslist" title="上架规格" :item="item" :key="item.goods_id">
            <flexbox justify="space-between">
              <flexbox-item span="80">
                <x-button @click.native="del(item.goods_id,index)" mini type="warn">删除</x-button>
              </flexbox-item>
              <flexbox-item span="140">
                <x-button mini :link="{name:'addtomygoods',params:{goods_id:item.goods_id,action:'edit'}}" type="primary">修改</x-button>
              </flexbox-item>
            </flexbox>
          </goods-item>
        </div>
      </scroller>
  </div>
</template>
<script>
import GoodsItem from "@/components/GoodsItem";
import { XButton, Flexbox, FlexboxItem } from "vux";
export default {
  name: "mygoods",
  data() {
    return {
      goodslist:[]
    };
  },
  components: {
    GoodsItem,
    XButton,
    Flexbox,
    FlexboxItem
  },
  methods:{
    del(goods_id,index) {
      var that = this
      this.$vux.confirm.show({
        content: "你确定删除此商品吗？",
        onConfirm() {
          that.$http
            .post("/api/supplier.shop_goods/delete_all", {
              goods_id,
            })
            .then(res => {
              if (res.data.code) {
                that.$vux.toast.show({
                  text:"删除成功"
                });
                that.goodslist.splice(index,1)
              }
            });
        }
      });
    }
  },
  activated() {
    this.$http.get("/api/supplier.shop_goods/my_index").then(res => {
      this.goodslist = res.data.data.list
    });
  }
};
</script>
<style scoped lang="less">
.mygoods {
  .goodslist{
    padding-bottom: 10px;
  }
  button {
    width: 100%;
    font-size: 14px;
  }
}
</style>